<%-- 
    Document   : applicationcontent
    Created on : 05 4, 11, 5:14:24 PM
    Author     : Lee
--%>

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>


<s:div id="application">
    <s:form action="get-borrower-appform" theme="simple" cssStyle="position: relative; left: 550px; font-size: 11px !important; width: 450px;">
        <!--        cssStyle="position: relative; top: 74px; left: 335px -->
        <s:label cssStyle="font-size: 11px !important">Enter the Loan Verification No: </s:label>
        <s:textfield name="catvalue" value="appli" cssStyle="display: none" />
        <sj:autocompleter list="%{#laaf.laafList}" indicator="true" cssStyle="width: 10px !important; background-color: white; z-index: 10000" cssClass="autocomplete" id="autocomplete" name="borrowerinfo" selectBox="true" />
        <sj:submit id="go" button="true" cssClass="ui-state-default" cssStyle="font-size:12px; visibility: hidden" value="Go" />
    </s:form>
    <s:form id="loanappform" name="loanappform" action="add-borrower" theme="simple" cssClass="cmxform" method="post" enctype="multipart/form-data">
        <!--                            Borrower Information-->
        <s:div id="document">
            <fieldset>
                <legend>
                    <h3>Document Information</h3>
                </legend>
                <table cellspacing="0" border="0" width="100%">
                    <tr>
                        <td><s:label>Document:</s:label></td>
                        <td><div class="inputContainer"><s:textfield id="documenttype" cssStyle="font-size: 11px; width: 100px" name="documenttype" label="Document Type" value="Application Form" readonly="true"/></div></td>
                        <td><s:label>Document Date:<strong>*</strong></s:label></td>
                        <td><div class="inputContainer"><sj:datepicker name="documentdate" cssStyle="font-size: 11px; width: 100px" id="documentdate" label="Document Date" cssClass="validate[required] text-input" /></div></td>
                        <td><s:label>Document No.:<strong>*</strong></s:label></td>
                        <td><div class="inputContainer"><s:textfield name="documentno" cssStyle="font-size: 11px; width: 100px" id="documentno" label="Document No."/></div></td>
                        <td><s:label>Document Image:</s:label></td>
                        <td><s:file name="userImage" id="userImage" label="User Image" cssStyle="font-size: 11px; width: 120px" /></td>
                    </tr>
                    <tr>
                        <s:if test="%{#request['loanver'] !=null}">
                            <%--     <% System.out.println("NULL LOANVER");%>--%>
                        </s:if>
                        <td><s:label>Document Ref</s:label></td><td><s:textfield readonly="true" id="docreftypeci" cssStyle="font-size: 11px; width: 100px" name="docreftypeci" label="Document Ref Type" value="Loan Application" /></td>
                        <td><s:label>Document Ref No.</s:label></td><td><s:textfield readonly="true" id="docrefnoci" cssStyle="font-size: 11px; width: 100px" name="docrefnoci" value="%{#request['loanver'].documents.documentno}" label="Document Ref No." /></td>
                        <td><s:label>Document Ref Date</s:label></td><td><s:textfield name="docdate" cssStyle="font-size: 11px; width: 100px" label="Document Date" readonly="true" value="%{#request['loanver'].documents.documentdate}" /></td>
                        <td style="display: none"><s:label>Loan Verification ID</s:label></td><td style="display: none"><s:textfield name="loanverid" cssStyle="font-size: 11px; width: 100px" label="loanverid" readonly="true" value="%{#request['loanver'].loanverificationid}" /></td>
                    </tr>
                    <tr>
                        <td><s:label>Borrower Code:</s:label></td>
                        <td><div class="inputContainer"><s:textfield cssStyle="font-size: 11px; width: 100px" label="Borrower Code" key="borrower.borrowerid" readonly="true" name="borid" id="borid" value="%{#request['borrowerinfo'].borrowercode}"/></div></td>
                        <td><s:label>Borrower Name:</s:label></td>
                        <td><div class="inputContainer"><s:textfield cssStyle="font-size: 11px; width: 100px" label="Borrower Name" key="borrower.borrowerfirstname" readonly="true" name="borname" id="borname" value="%{#request['borrowerinfo'].completename}"/></div></td>
                    </tr>
                    <tr style="display: none">
                        <td><s:label>Branch Code</s:label></td>
                        <td><s:textfield label="Branch Code:" name="selectedBranch" id="selectedBranch" value="%{#session['branch'].branchcode}" readonly="true"  /></td>
                        <td><s:label>Employee Id</s:label></td>
                        <td><s:textfield name="employees" id="employees" label="Employee Id" value="%{#session['employee'].idnumber}" readonly="true" key="loanapplications.employees" /><%-- --%></td>
                    </tr>
                    <tr style="display: none;">
                        <td><s:label>Status</s:label></td>
                        <td><s:textfield label="Status" key="loanapplciations.status" name="status" id="status" value="pending"/></td>
                    </tr>
                </table>
            </fieldset>
            <s:div id="navigation">
                <ul class="fragmentnav" style="margin-left: 30px;">
                    <li><s:a href="#document">Document Information |</s:a></li>
                    <li><s:a href="#loan"> Loan Information |</s:a></li>
                    <li><s:a href="#borrower" > Borrower Information |</s:a></li>
                    <li><s:a href="#spouse" > Spouse and Dependents |</s:a></li>
                    <li><s:a href="#business" > Business Information |</s:a></li>
                    <li><s:a href="#coborrower" > Co-borrower and References |</s:a></li>
                    <li><s:a href="#requirements" > Requirements</s:a></li>
                </ul>
            </s:div>
        </s:div>
        <s:div id="applicationoverflow" cssStyle="height: 320px; overflow: auto">
            <div id="loan">
                <fieldset>
                    <legend>
                        <h3>Loan Information</h3>
                    </legend>
                    <table border="0" width="100%">
                        <tr>
                            <td><s:label>Loan Classification<strong>*</strong></s:label></td>
                            <td>
                                <div class="inputContainer">
                                    <s:select
                                        id="loanclass"
                                        key="loanclass"
                                        cssClass="validate[required]"
                                        label="Loan Classification"
                                        name="loanclass"
                                        list="{'New','Renew'}"
                                        headerKey="-1"
                                        headerValue=""
                                        readonly="true"
                                        emptyOption="false"
                                        value="%{#request['loanver'].loantype}" />
                            </td>
                            <td><s:label>Loan Type<strong>*</strong></s:label></td>
                            <td><div class="inputContainer"><s:select
                                        id="loantype"
                                        key="loantype"
                                        cssClass="validate[required]"
                                        label="Loan Type"
                                        name="loantype"
                                        list="%{#p.products}"
                                        listKey ="productname"
                                        listValue="productname"
                                        headerKey="-1"
                                        readonly="true"
                                        headerValue=""
                                        value="%{#request['loanver'].products.productname}"
                                        emptyOption="false"
                                        /></td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Loan Term<strong>*</strong></s:label>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield value="%{#request['loanver'].loanterm}" readonly="true" id="amortizationdays" name="amortizationdays" label="Amortization Days" cssClass="validate[required] text-input" /><%-- --%>
                            </td>
                            <td>
                                <s:label>Amount Applied<strong>*</strong></s:label>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield id="amountrequested1" readonly="true" value="%{#request['loanver'].amountapplied}" name="amountrequested1" label="Amount Requested" key="loanapplications.amountrequested" cssClass="validate[required] text-input"/><%-- --%>
                            </td>
                            <td>
                                <s:label>Amount Requested<strong>*</strong></s:label>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield id="amountrequested" name="amountrequested" value="%{#request['loanver'].amountrequested}" label="Amount Requested" key="loanapplications.amountrequested" cssClass="validate[required] text-input"/><%-- --%>
                            </td>
                        </tr>
                        <%--<s:if test="%{#request['renew'] == 'yes'}">
                            <tr>
                                <td><s:label>Previous Account No.<strong>*</strong></s:label></td>
                                <td>
                                    <s:textfield name="1" id="1" readonly="true" value="%{#request['loan'].loanid}" />
                                </td>
                                <td><s:label>Previous Loan Date<strong>*</strong></s:label></td>
                                <td>
                                    <s:textfield name="2" id="2" readonly="true" value="%{#request['loan'].releasedate}" />
                                </td>
                                <td><s:label>Previous Loan Type<strong>*</strong></s:label></td>
                                <td>
                                    <s:textfield name="3" id="3" readonly="true" value="%{#request['loan'].loanapplications.products.productname}" />
                                </td>
                            </tr>
                            <tr>
                                <td><s:label>Previous Loan Balance<strong>*</strong></s:label></td>
                                <td>
                                    <s:textfield name="14" id="14" readonly="true" value="%{#request['loan'].balance}" />
                                </td>
                                <td><s:label>Previous Loan Amount<strong>*</strong></s:label></td>
                                <td>
                                    <s:textfield name="15" id="15" readonly="true" value="%{#request['loan'].loanamount}" />
                                </td>
                            </tr>
                        </s:if>--%>

                        <tr style="display: none">
                            <td>
                                <s:label>Suggested Amount<strong>*</strong></s:label>
                            </td>
                            <td>
                                <s:textfield id="suggestedamount" name="suggestedamount" label="Amortization Days" value="0"/><%-- --%>
                            </td>

                        </tr>
                        <tr style="display: none">
                            <td><s:label>Remarks</s:label></td><td>
                                <s:textarea cols="30" rows="10" name="remarks" id="remarks" label="Remarks" key="loanapplications.remarks" /><%-- --%>
                            </td>
                        </tr>
                    </table>
                </fieldset>
            </div>
            <div id="borrower">
                <fieldset>
                    <legend>
                        <h3>Borrower Information</h3>
                    </legend>
                    <table cellspacing="0" border="0" width="100%">
                        <tr>
                            <td colspan="6" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Borrower Name</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <!--                        <tr><td><span style="color: red; font-size: 10px">Note: Fields marked with (*) are required.</td></span></tr>-->
                        <tr>
                            <td><s:label>First Name<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield label="First Name" key="bor.firstname" value="%{#request['borrowerinfo'].firstname}" name="firstname" id="firstname" cssClass="validate[required] text-input" /></div></td>
                            <td><s:label>Middle Name<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield label="Middle Name" key="bor.middlename" value="%{#request['borrowerinfo'].middlename}" name="middlename" id="middlename" title="Please enter your username (at least 3 characters)" cssClass="validate[required] text-input"  /></div></td>
                            <td> <s:label>Last Name<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield label="Last Name" key="bor.lastname" value="%{#request['borrowerinfo'].lastname}" name="lastname" id="lastname" title="Please enter your username (at least 3 characters)" cssClass="validate[required] text-input" /></div></td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <!--                    <hr />-->
                    <table cellspacing="0" border="0" width="100%">
                        <tr>
                            <td><s:label>Area Code</s:label></td>
                            <td><div class="inputContainer"><s:select
                                        label="Area Code:"
                                        name="selectedArea"
                                        id="selectedArea"
                                        list="%{#a.areas}"
                                        listKey ="areacode"
                                        listValue="areacode"
                                        headerKey="-1"
                                        readonly="true"
                                        headerValue=""
                                        emptyOption="false"
                                        cssClass="validate[required]"
                                        value="%{#request['borrowerinfo'].areas.areacode}"
                                        /></td>  
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Current Home Address</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td><s:label>Street Address<strong>*</strong></s:label></td>
                            <td><s:label>Barangay<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Municipality/City<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Postal Code<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Province<strong>*</strong></s:label><%-- --%></td>
                        </tr>
                        <tr>
                        </tr>
                        <td>
                            <div class="inputContainer"><s:textfield label="Street Address" value="%{#request['borrowerinfo'].streetaddress}"  key="bor.streetaddress" name="streetaddress" id="streetaddress" cssStyle="width: 160px" cssClass="validate[required]" />
                        </td>
                        <td>
                            <div class="inputContainer"><s:textfield label="Barangay" value="%{#request['borrowerinfo'].barangay}"  key="bor.barangay" name="barangay" id="barangay" cssClass="validate[required]"/>
                        </td>
                        <td>
                            <div class="inputContainer"><s:textfield label="City or Municipality" value="%{#request['borrowerinfo'].cityormunicipality}"  key="bor.cityormunicipality" id="cityormunicipality" name="cityormunicipality" cssClass="validate[required]"/>
                        </td>
                        <td>
                            <div class="inputContainer"><s:textfield label="Postal Code" value="%{#request['borrowerinfo'].postalcode}"  key="bor.postalcode" id="postalcode" name="postalcode" cssClass="validate[required]"/>
                        </td>
                        <td>
                            <div class="inputContainer"><s:textfield label="Province" value="%{#request['borrowerinfo'].province}"  key="bor.province" id="province" name="province" cssClass="validate[required]"/>
                        </td>
                        </tr>
                        <tr>
                            <td colspan="3"><s:label>Present Address Stability<strong>*</strong></s:label><%-- --%>
                                <div class="inputContainer"><s:select
                                        id="presentaddressstatus"
                                        key="loanapplications.presentaddressstatus"
                                        cssClass="validate[required]"
                                        label="Stability"
                                        name="presentaddressstatus"
                                        list="{'Renting','Owned/Mortgage','Owned/Clean Title','Free'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        value="%{#request['loaninfo'].presentaddressstatus}" /><%-- --%>
                            </td>
                            <td><s:label>Years of Stay<strong>*</strong></s:label><%-- --%>
                                <div class="inputContainer"><s:select
                                        id="presentaddresslengthofstayinyears"
                                        cssStyle="width: 40px;"
                                        cssClass="validate[required]"
                                        key="loanapplications.presentaddresslengthofstayinyears"
                                        label="years"
                                        name="presentaddresslengthofstayinyears"
                                        list="{'0','1','2','3','4','5','6','7','8','9','10'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        value="%{#request['loaninfo'].presentaddresslengthofstayinyears}" />
                            </td>
                            <td><s:label>Months of Stay<strong>*</strong></s:label><%-- --%>
                                <div class="inputContainer"><s:select
                                        id="presentaddresslengthofstayinmonths"
                                        cssStyle="width: 40px;"
                                        cssClass="validate[required]"
                                        key="loanapplications.presentaddresslengthofstayinmonths"
                                        label="months"
                                        name="presentaddresslengthofstayinmonths"
                                        list="{'1','2','3','4','5','6','7','8','9','10','11','12'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        value="%{#request['loaninfo'].presentaddresslengthofstayinmonths}" />
                            </td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <!--                    <hr />-->
                    <table width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Provincial Home Address</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td><s:label>Street Address<strong>*</strong></s:label></td>
                            <td><s:label>Barangay<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Municipality/City<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Postal Code<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Province<strong>*</strong></s:label><%-- --%></td>
                        </tr>
                        <tr>
                            <td>
                                <div class="inputContainer"><s:textfield id="provincialstreetaddress" name="provincialstreetaddress" value="%{#request['loaninfo'].provincialstreetaddress}" label="Street No." key="loanapplications.provincialstreetaddress" cssStyle="width: 160px" cssClass="validate[required]" />
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield id="provincialbarangay" name="provincialbarangay" value="%{#request['loaninfo'].provincialbarangay}" label="Barangay" key="loanapplications.provincialbarangay" cssClass="validate[required]"/>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield id="provincialcityormunicipality" name="provincialcityormunicipality" value="%{#request['loaninfo'].provincialcityormunicipality}" label="Municipality/City" key="loanapplications.provincialcityormunicipality" cssClass="validate[required]"/>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield id="provincialpostalcode" name="provincialpostalcode" value="%{#request['loaninfo'].provincialpostalcode}" label="Postal Code" key="loanapplications.provincialpostalcode" cssClass="validate[required]"/>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield id="provincialprovince" name="provincialprovince" value="%{#request['loaninfo'].provincialprovince}" label="Province" key="loanapplications.provincialprovince" cssClass="validate[required]"/>
                            </td>

                        </tr>
                        <tr>
                            <td colspan="3"><s:label>Provincial Address Stability<strong>*</strong></s:label><%-- --%>
                                <div class="inputContainer"><s:select
                                        id="provincialaddressstatus"
                                        key="loanapplications.provincialaddressstatus"
                                        cssClass="validate[required]"
                                        label="Stability"
                                        name="provincialaddressstatus"
                                        list="{'Renting','Owned/Mortgage','Owned/Clean Title','Free'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        value="%{#request['loaninfo'].provincialaddressstatus}" /><%-- --%>
                                    <s:label label="Length of Stay"/>
                            </td>
                            <td><s:label>Years of Stay<strong>*</strong></s:label><%-- --%>
                                <div class="inputContainer"><s:select
                                        id="provincialaddresslengthofstayinyears"
                                        cssStyle="width: 40px;"
                                        cssClass="validate[required]"
                                        key="loanapplications.provincialaddresslengthofstayinyears"
                                        label="years"
                                        name="provincialaddresslengthofstayinyears"
                                        list="{'0','1','2','3','4','5','6','7','8','9','10'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        value="%{#request['loaninfo'].provincialaddresslengthofstayinyears}" />
                            </td>
                            <td><s:label>Months of Stay<strong>*</strong></s:label><%-- --%>
                                <div class="inputContainer"><s:select
                                        id="provincialaddresslengthofstayinmonths"
                                        cssStyle="width: 40px;"
                                        cssClass="validate[required]"
                                        key="loanapplications.provincialaddresslengthofstayinmonths"
                                        label="months"
                                        name="provincialaddresslengthofstayinmonths"
                                        list="{'1','2','3','4','5','6','7','8','9','10','11','12'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        value="%{#request['loaninfo'].provincialaddresslengthofstayinmonths}" />
                            </td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <!--                    <hr />-->
                    <table cellspacing="0" border="0"  width="100%">
                        <tr>
                            <td colspan="6" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Personal Information</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td><s:label>Date of Birth<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><sj:datepicker label="Date of Birth" key="bor.dateofbirth" value="%{#request['borrowerinfo'].dateofbirth}" name="dateofbirth" id="dateofbirth" displayFormat="mm/dd/yy" cssClass="validate[required]" /><%-- --%></td>
                            <td><s:label>Age<strong>*</strong></s:label></td><td>
                                <s:textfield label="Age" key="bor.age" name="age" id="age" value="%{#request['borrowerinfo'].age}" /><%-- --%></td>
                            <td><s:label>Place of Birth<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield label="Place of Birth" key="bor.placeofbirth" value="%{#request['borrowerinfo'].placeofbirth}" name="placeofbirth" id="placeofbirth" cssClass="validate[required]" /><%-- --%></td>
                        </tr>
                        <tr>
                            <td><s:label>Religion<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield id="religion" label="Religion" key="bor.religion" value="%{#request['borrowerinfo'].religion}" name="religion" cssClass="validate[required]" /><%-- --%></td>
                            <td><s:label>Citizenship<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield id="citizenship" label="Citizenship" key="bor.citizenship" value="%{#request['borrowerinfo'].citizenship}" name="citizenship" cssClass="validate[required]"  /><%-- --%></td>
                            <td><s:label>Civil Status<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:select
                                        id="selectedStatus"
                                        label="Civil Status"
                                        name="selectedStatus"
                                        list="{'Single','Married','Separated','Annulled','Widowed'}"
                                        headerKey="-1"
                                        headerValue=""
                                        emptyOption="false"
                                        cssClass="validate[required]"
                                        value="%{#request['borrowerinfo'].civilstatus}" /><%-- --%></td>
                        </tr>
                        <tr>
                            <td><s:label>Contact No.</s:label></td><td>
                                <s:textfield label="Contact No." name="contactno" id="contactno" value="%{#request['borrowerinfo'].contactnumber}" /><%-- --%></td>
                        </tr>
                    </table>
                </fieldset>
            </div>
            <div id="spouse">
                <fieldset>
                    <legend>
                        <h3>Spouse and Dependents</h3>
                    </legend>
                    <table  cellspacing="0" border="0"  width="100%"> 
                        <tr>
                            <td colspan="6" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Spouse Name</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td><s:label>First Name</s:label></td><td>
                                <s:textfield id="spouserfirstname" name="spousefirstname" value="%{#request['loaninfo'].spousefirstname}" label="First Name" key="loanapplications.spousefirstname" /></td>
                            <td><s:label>Middle Name</s:label></td><td>
                                <s:textfield id="spousemiddlename" name="spousemiddlename" value="%{#request['loaninfo'].spousemiddlename}" label="Middle Name" key="loanapplications.spousemiddlename"/></td>
                            <td> <s:label>Last Name</s:label></td><td>
                                <s:textfield id="spouselastname" name="spouselastname" value="%{#request['loaninfo'].spouselastname}" label="Last Name" key="loanapplications.spouselastname"/></td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <table width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Spouse Provincial Home Address</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td><s:label>Street Address</s:label></td>
                            <td><s:label>Barangay</s:label><%-- --%></td>
                            <td><s:label>Municipality/City</s:label><%-- --%></td>
                            <td><s:label>Postal Code</s:label><%-- --%></td>
                            <td><s:label>Province</s:label><%-- --%></td>
                        </tr>
                        <tr>
                            <td>
                                <s:textfield id="spouseprovincialstreetaddress" value="%{#request['loaninfo'].spouseprovincialstreetaddress}" name="spouseprovincialstreetaddress" label="Street Address" key="loanapplications.spouseprovincialstreetaddress" cssStyle="width: 160px"/>
                            </td>
                            <td>
                                <s:textfield id="spouseprovincialbarangay" value="%{#request['loaninfo'].spouseprovincialbarangay}" name="spouseprovincialbarangay" label="Barangay" key="loanapplications.spouseprovincialbarangay"/>
                            </td>
                            <td>
                                <s:textfield id="spouseprovincialcityormunicipality" value="%{#request['loaninfo'].spouseprovincialcityormunicipality}" name="spouseprovincialcityormunicipality" label="Municipality/City" key="loanapplications.spouseprovincialcityormunicipality"/>
                            </td>
                            <td>
                                <s:textfield id="spouseprovincialpostalcode" value="%{#request['loaninfo'].spouseprovincialpostalcode}" name="spouseprovincialpostalcode" label="Postal Code" key="loanapplications.spouseprovincialpostalcode"/>
                            </td>
                            <td>
                                <s:textfield id="sprovprovince" value="%{#request['loaninfo'].spouseprovincialprovince}" name="spouseprovincialprovince" label="Province" key="loanapplications.spouseprovincialprovince"/>
                            </td>

                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <table width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Spouse Personal Information</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td><s:label>Date of Birth</s:label></td><td>
                                <sj:datepicker id="spousedateofbirth" name="spousedateofbirth" value="%{#request['loaninfo'].spousedateofbirth}" label="Date of Birth" key="loanapplications.spousedateofbirth" /></td>
                            <td><s:label>Place of Birth</s:label></td><td>
                                <s:textfield id="spouseplaceofbirth" name="spouseplaceofbirth" value="%{#request['loaninfo'].spouseplaceofbirth}" label="Place of Birth" key="loanapplications.spouseplaceofbirth"/></td>
                            <td><s:label>Religion</s:label></td><td>
                                <s:textfield id="spousereligion" name="spousereligion" value="%{#request['loaninfo'].spousereligion}" label="Religion" key="loanapplications.spousereligion"/></td>
                        </tr>
                        <tr>
                            <td><s:label>Citizenship</s:label></td><td>
                                <s:textfield id="spousecitizenship" name="spousecitizenship" label="Citizenship" value="%{#request['loaninfo'].spousecitizenship}" key="loanapplications.spousecitizenship"/></td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <table id="tbldependent" border="0" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Children/Dependents</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="6" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td>Name</td>
                            <td>Relationship</td>
                            <td>Age</td>
                        </tr>
                        <tr id="tobecloned">
                            <td id="labelto">1</td>
                            <td>
                                <s:textfield id="dependentname" name="dependentname" label="Name" key="dependents.name" cssStyle="width: 200px"/><%-- --%>
                            </td>
                            <td>
                                <s:textfield id="dependentrelationship" name="dependentrelationship" label="Relationship" key="dependents.relationship"/><%-- --%>
                            </td>
                            <td>
                                <s:textfield id="dependentage" name="dependentage" label="Age" cssStyle="width: 80px"/>
                            </td>
                        </tr>
                    </table>

                    <p><input type="button" id="btndependent" value="Add More" /></p>
                </fieldset>
            </div>
            <div id="business">
                <fieldset>
                    <legend>
                        <h3>Business Information</h3>
                    </legend>
                    <table border="0" id="tblbus" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Business Name and Type</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr><td><span style="color: red; font-size: 10px">Note: At least one (1) business is required.</td></span></tr>
                        <tr>
                            <td></td>
                            <td>Business Type</td>
                            <td>Business Name</td>
                        </tr>

                        <tr id="tobeclonedbus">
                            <td>1</td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businesstype" id="businesstype" label="Business Type" key="businesses.businesstype" cssClass="validate[required]" /><%-- --%></td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businessname" id="businessname" label="Business Name" key="businesses.businessname" cssClass="validate[required]" /><%-- --%></td>
                        </tr>
                    </table>
                    <p><input type="button" id="btnbus" value="Add More" /></p>
                    <table id="tbladdress" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Business Address</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td><s:label>Street Address<strong>*</strong></s:label></td>
                            <td><s:label>Barangay<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Municipality/City<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Postal Code<strong>*</strong></s:label><%-- --%></td>
                            <td><s:label>Province<strong>*</strong></s:label><%-- --%></td>
                        </tr>
                        <tr id="tobeclonedaddress">
                            <td>1</td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businessstreetaddress" id="businessstreetaddress" label="Street No." key="businesses.streetaddress"  cssStyle="width: 160px" cssClass="validate[required]"/>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businessbarangay" id="businessbarangay" label="Barangay" key="businesses.barangay" cssStyle="float: left" cssClass="validate[required]"/>
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businesscityormunicipality" id="businesscityormunicipality" label="Municipality/City" key="businesses.cityormunicipality" cssClass="validate[required]" />
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businesspostalcode" id="businesspostalcode" label="Postal Code" key="businesses.postalcode" cssClass="validate[required]" />
                            </td>
                            <td>
                                <div class="inputContainer"><s:textfield name="businessprovince" id="businessprovince" label="Province" key="businesses.province" cssClass="validate[required]" />
                            </td>
                        </tr>
                    </table>
                    <table id="tblstability">
                        <tr>
                            <td></td>
                            <td><s:label>Business Stability</s:label></td>
                            <td><s:label>Years in business</s:label></td>
                            <td><s:label>Months in Business</s:label></td>
                        </tr>
                        <tr id="tobeclonedstability">
                            <td>1</td>
                            <td><%-- --%>
                                <s:select
                                    label="Stability"
                                    id="businessstability"
                                    name="businessstability"
                                    list="{'Renting','Owned/Mortgage','Owned/Clean Title','Free'}"
                                    headerKey="-1"
                                    headerValue=""
                                    emptyOption="false"
                                    value="" /><%-- --%></td>
                            <td><%-- --%>
                                <s:select
                                    id="businessyears"
                                    cssStyle="width: 40px;"
                                    label="years"
                                    list="{'0','1','2','3','4','5','6','7','8','9','10'}"
                                    headerKey="-1"
                                    headerValue=""
                                    emptyOption="false"
                                    value="" /></td>
                            <td><%-- --%>
                                <s:select
                                    id="businessmonths"
                                    cssStyle="width: 40px;"
                                    label="months"
                                    list="{'1','2','3','4','5','6','7','8','9','10','11','12'}"
                                    headerKey="-1"
                                    headerValue=""
                                    emptyOption="false"
                                    value="" /></td>
                        </tr>
                    </table>
                    <p><input type="button" id="btndependent" value="Add More" /></p>
                    <table border="0">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Statement of Monthly Income</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td colspan="2" style="font-size: 12px; font-weight: bold;"><s:label>Income</s:label></td>
                            <td style="visibility: hidden">---------</td>
                            <td colspan="2" style="font-size: 12px; font-weight: bold;"><s:label>Less Expenses</s:label></td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Business<strong>*</strong></s:label></td><td>
                                <s:textfield id="business" name="business" label="Business" value="%{#request['monthlyincome'].business}" key="monthlyincome.business"/><%-- --%>
                            </td>
                            <td style="visibility: hidden">---------</td>
                            <td>
                                <s:label>Rent<strong>*</strong></s:label></td><td>
                                <s:textfield id="rentexpense" name="rentexpense" label="Rent" value="%{#request['monthlyincome'].rentexpense}" key="monthlyincome.rentexpense"/><%-- --%>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Employment<strong>*</strong></s:label></td><td>
                                <s:textfield id="employement" name="employement" label="employment" value="%{#request['monthlyincome'].employement}" key="monthlyincome.employement"/><%-- --%>
                            </td>
                            <td style="visibility: hidden">---------</td>
                            <td>
                                <s:label>Food and Clothing<strong>*</strong></s:label></td><td>
                                <s:textfield id="foodandclothing" name="foodandclothing" label="Food and Clothing" value="%{#request['monthlyincome'].foodandclothing}" key="monthlyincome.foodandclothing"/><%-- --%>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Spouse Income<strong>*</strong></s:label></td><td>
                                <s:textfield id="spouseincome" name="spouseincome" label="Spouse Income" value="%{#request['monthlyincome'].spouseincome}" key="monthlyincome.spouseincome"/><%-- --%>
                            </td>
                            <td style="visibility: hidden">---------</td>
                            <td>
                                <s:label>Education<strong>*</strong></s:label></td><td>
                                <s:textfield id="education" name="education" label="Education" value="%{#request['othersources'].monthlyincome}" key="monthlyincome.education"/><%-- --%>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Other Sources<strong>*</strong></s:label></td><td>
                                <s:textfield id="othersources" name="othersources" label="Other Sources" value="%{#request['monthlyincome'].othersources}" key="monthlyincome.othersources"/><%-- --%>
                            </td>
                            <td style="visibility: hidden">---------</td>
                            <td>
                                <s:label>Outstanding Loan<strong>*</strong></s:label></td><td>
                                <s:textfield id="outstandingloan" name="outstandingloan" label="Outstanding Loan" value="%{#request['monthlyincome'].outstandingloan}" key="monthlyincome.outstandingloan"/><%-- --%>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Gross Income<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield id="grossincome" name="grossincome" label="Gross Income" value="%{#request['monthlyincome'].othersources}" key="monthlyincome.grossincome" cssClass="validate[required]" /><%-- --%>
                            </td>
                            <td style="visibility: hidden">---------</td>
                            <td>
                                <s:label>Total Expenses<strong>*</strong></s:label></td><td>
                                <s:textfield id="totalexpenses" name="totalexpenses" label="Total Expenses" value="%{#request['monthlyincome'].totalexpenses}" key="monthlyincome.totalexpenses"/><%-- --%>
                            </td>
                        </tr>
                        <tr>
                            <td></td>
                            <td style="visibility: hidden">---------</td>
                            <td></td>
                            <td><s:label>Net Income Before Tax<strong>*</strong></s:label></td><td>
                                <div class="inputContainer"><s:textfield id="netincomebeforetax" value="%{#request['monthlyincome'].netincomebeforetax}" name="netincomebeforetax" label="Net Income Before Tax" key="monthlyincome.netincomebeforetax" cssClass="validate[required]"/><%-- --%>
                            </td>
                        </tr>
                    </table>
                    <table border="0" id="tblloan" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Loans with Banks and Other Institutions</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td></td>
                            <td><s:label>Name</s:label></td>
                            <td><s:label>Principal Amount</s:label></td>
                            <td><s:label>Balance</s:label></td>
                        </tr>
                        <tr id="tobeclonedloan">
                            <td>1</td>
                            <td>
                                <s:textfield id="bankname" name="bankname" label="Name" key="loanswithoterbanks.bankname" cssStyle="300px"/><%-- --%>
                            </td>
                            <td>
                                <s:textfield id="principalamt" name="principalamt" label="Principal Amount" key="loanswithoterbanks.principalamt"/><%-- --%>
                            </td>
                            <td>
                                <s:textfield id="balance" name="balance" label="Balance" key="loanswithoterbanks.balance"/><%-- --%>
                            </td>
                        </tr>
                    </table>
                    <p><input type="button" id="btnloans" value="Add More" /></p>
                </fieldset>
            </div>
            <div id="coborrower">
                <fieldset>
                    <legend>
                        <h3>Coborrower and Character References</h3>
                    </legend>
                    <table border="0" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Co-borrower Name</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>First Name</s:label>
                                <s:textfield name="coborrowerfirstname" value="%{#request['loanver'].coborrowerfirstname}" id="coborrowerfirstname" label="First Name" key="loanapplications.coborrowerfirstname" />
                            </td>
                            <td>
                                <s:label>Middle Name</s:label>
                                <s:textfield name="coborrowermiddlename" value="%{#request['loanver'].coborrowermiddlename}" id="coborrowermiddlename" label="Middle Name" key="loanapplications.coborrowermiddlename" />

                            </td>
                            <td>
                                <s:label>Last Name</s:label>
                                <s:textfield name="coborrowerlastname" value="%{#request['loanver'].coborrowerlastname}" id="coborrowerlastname" label="Last Name" key="loanapplications.coborrowerlastname" />
                            </td>
                            <td>
                                <s:label>Religion</s:label>
                                <s:textfield name="coborrowerreligion" id="coborrowerreligion" label="Religion" key="loanapplications.spousereligion"/>
                            </td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <table border="0" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Co-borrower Address</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr>
                            <td>
                                <s:label>Street No.</s:label>
                                <s:textfield name="coborrowerstreetaddress" value="%{#request['loanver'].coborrowerstreetaddress}" id="coborrowerstreetaddress" label="Street No." key="loanapplications.coborrowerstreetaddress" />
                            </td>
                            <td>
                                <s:label>Barangay</s:label><%-- --%>
                                <s:textfield name="coborrowerbarangay" value="%{#request['loanver'].coborrowerbarangay}" id="coborrowerbarangay" label="Barangay" key="loanapplications.coborrowerbarangay"/>
                            </td>
                            <td>
                                <s:label>Municipality/City</s:label><%-- --%>
                                <s:textfield name="coborrowercityormunicipality" value="%{#request['loanver'].coborrowercityormunicipality}" id="coborrowercityormunicipality" label="Municipality/City" key="loanapplications.coborrowercityormunicipality"/>
                            </td>
                            <td>
                                <s:label>Province</s:label><%-- --%>
                                <s:textfield name="coborrowerprovince" value="%{#request['loanver'].coborrowerprovince}" id="coborrowerprovince" label="Province" key="loanapplications.coborrowerprovince"/>
                            </td>
                            <td>
                                <s:label>Postal Code</s:label><%-- --%>
                                <s:textfield name="coborrowerpostalcode" id="coborrowerpostalcode" label="Postal Code" key="loanapplications.coborrowerpostalcode"/>
                            </td>
                        </tr>
                    </table>
                    <p style="visibility: hidden; margin: 0; padding:0">Divider</p>
                    <table border="0" id="tblreferences" width="100%">
                        <tr>
                            <td colspan="5" style="font-size: 12px; font-weight: bold;"><s:label cssStyle="font-size: 12px; font-weight: bold;">Character and Credit References</s:label></td>
                        </tr>
                        <tr>
                            <td colspan="5" style="font-size: 14px; font-weight: bold;"><hr /></td>
                        </tr>
                        <tr><td colspan="4"><span style="color: red; font-size: 10px">Note: At least one (1) character reference is required.</td></span></tr>
                        <tr>
                            <td></td>
                            <td><s:label>Name<strong>*</strong></s:label></td>
                            <td><s:label>Address<strong>*</strong></s:label></td>
                            <td><s:label>Position/Occupation<strong>*</strong></s:label></td>
                        </tr>
                        <tr id="tobeclonedreferences">
                            <td>1</td>
                            <td width="25%">
                                <div class="inputContainer"><s:textfield id="referencename" name="referencename" label="Name" key="characterreferences.name" cssStyle="width: 100%" cssClass="validate[required]" />
                            </td>
                            <td <td width="50%">
                                <div class="inputContainer"><s:textfield id="referenceaddress" name="referenceaddress" label="Address" key="characterreferences.address" cssStyle="width: 100%" cssClass="validate[required]" />
                            </td>
                            <td <td width="25%">
                                <div class="inputContainer"><s:textfield id="referenceoccupation" name="referenceoccupation" label="Position/Occupation" key="characterreferences.occupation" cssStyle="width: 100%" cssClass="validate[required]" />
                            </td>
                        </tr>
                    </table>
                    <p><input type="button" id="btnreferences" value="Add More" /></p>
                </fieldset>
            </div>
            <div id="requirements">
                <fieldset>
                    <legend>
                        <h3>Requirements</h3>
                    </legend>
                    <div class="inputContainer" style="display: inline; width: 900px">
                        <s:iterator value="%{#r.requirements}" status="stat">
                            <s:set name="rname" value="requirementname" var="rname" />
                            <div style="width: 300px !important; height: 25px; float: left">
                                <s:checkbox cssStyle="display: inline" cssClass="validate[minCheckbox[2]] checkbox" name="requirement" id="%{#rname}" value="false" fieldValue="%{#rname}" key="reputation.type" />
                                <s:label cssStyle="display: inline" ><s:property value="requirementname"/></s:label>
                            </div>
                            <s:if test="#stat.count%3==0">
                                </br>
                            </s:if>
                        </s:iterator>
                    </div>
                </fieldset>
            </div>
        </s:div>
        <s:div id="buttons" cssStyle="float:right">
            <sj:submit cssClass="ui-state-default" value="Save to Loan Applications" button="true" cssStyle="float:left;margin-top:2px;font-size:12px !important;font-family: Tahoma, Geneva, sans-serif !important;" />
            <%--<sj:a button="true" 
                  cssClass="default" 
                  cssStyle="float:left;
                  height:22px !important;
                  margin-top:2px;
                  font-size:12px !important;
                  line-height: 0;
                  font-family: Tahoma, Geneva, sans-serif;">
                Cancel
            </sj:a>--%>
            <%--<sj:a 
                button="true"
                href="#" 
                onclick="evalLoanApp()"
                cssClass="default" 
                cssStyle="float:left;
                height:22px !important;
                margin-top:2px;
                font-size:12px !important;
                line-height: 0;
                font-family: Tahoma, Geneva, sans-serif;">
                Save
            </sj:a>--%>
        </s:div>
    </s:form> 
</s:div>
